<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<meta charset="utf-8">
		<title>安全工单</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<!--防止外泄referer-->
		<meta name="referrer" content="never">
		<link href="__PUBLIC__/Home/css/bootstrap.min.css" rel="stylesheet">
		<link href="__PUBLIC__/Home/index/carousel.css" rel="stylesheet">
		<link href="__PUBLIC__/Home/css/styles.css" rel="stylesheet">
		 <style>
        body {
            font-family: Arial, sans-serif;
        }
        #imageContainer img {
            max-width: 100%;
            height: auto;
            cursor: pointer; /* 鼠标悬停变化 */
        }
        /* 模态背景样式 */
        #modal {
            display: none; /* 默认隐藏 */
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.8); /* 半透明黑色背景 */
            justify-content: center;
            align-items: center;
        }
  		#modalImage {
            display: flex; /* 将图像设为块级元素 */
            margin: 4% auto; /* 左右自动外边距以达到居中 */
            max-width: 100%; /* 防止超出容器 */
            height: auto; /* 保持宽高比 */ 
            justify-content: center; /* 水平居中 */ 
        }
        /* 模态内容样式 */
        #modal img {
            max-width: 90%; /* 最大宽度为 90% */
            max-height: 90%; /* 最大高度为 90% */
        }
    </style>
	</head>
	<body>

<div class="navbar navbar-fixed-top navbar-default" data-spy="affix" data-offset-top="1000">
  <div class="container">
    <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="yahei sr-only">Toggle navigation</span>
            <span class="yahei icon-bar"></span>
            <span class="yahei icon-bar"></span>
            <span class="yaheiicon-bar"></span>
          </button>
          <a class="yahei navbar-brand" href="/dev/index.php?m=&c=index&a=index"><strong>安全响应中心</strong>
          <span class="yahei navbar-brand-subtitle">外部安全工单</span>
          </a>
    </div>
    <div class="navbar-collapse collapse" id="navbar">
      <ul class="nav navbar-nav">
	    <li><a href="./admin.php?m=User&c=index&a=index">管理后台</a></li>
      </ul>
    </div>
   </div>
</div>

<!-- 报告详情 -->
<div class="gallery">
  <div class="container">
      <div class="col-md-12">
      	<div id="J_info">
	        <h3><strong>{$model.title}</strong></h3>
			<div class="row">
			<p><span>@{$model.time|date="Y-m-d H:i:s",###}</span><span> / </span><span>修补期限：</span><span> <if condition="$model.day eq 1"><span class="label label-warning">1天</span>
						<elseif condition="$model.day eq 0" /><span class="label label-success">无影响</span>
	                    <elseif condition="$model.day eq 2" /><span class="label label-default">10天</span>
	                    <elseif condition="$model.day eq 3" /><span class="label label-warning">3天</span>
	                    <elseif condition="$model.day eq 4" /><span class="label label-danger">2天</span>
	                    </if> / <span>危害评级：</span><if condition="$model.rank eq 1"><span class="label label-success">无影响</span>
	                    <elseif condition="$model.rank eq 2" /><span class="label label-default">低危</span>
	                    <elseif condition="$model.rank eq 3" /><span class="label label-warning">中危</span>
	                    <elseif condition="$model.rank eq 4" /><span class="label label-danger">高危</span>
	                    <elseif condition="$model.rank eq 5" /><span class="label label-danger">严重</span>
	                    </if></p>
	                    
	                   <a href="javascript:;" id="J_repay" class="btn btn-success" style="margin : -100px 1px 5px 92%;">确认修复</a>
	                   <a href="javascript:;" id="J_doc" class="btn btn-success" style="margin : -100px 1px 45px 82%;">导出成word</a>
			</div>
	
	        <div class="row">
	        	漏洞详情
	       		<p>
			   <pre>
				 {$model.content|htmlspecialchars_decode|waf}
				 </pre>
		    </div>
	   		<div class="row">
	        	影响范围
	       		<p>
			   <pre>{$model.property|htmlspecialchars_decode|waf}</pre>
		    </div>
	    </div>
		<div class="row">
			<hr/>
			<p><b>注意事项:</b></p>
			<p>1. 本页面为公司应急响应中心安全工单系统临时授权页面，<span style="color:red;">请您不要对外泄露本页面链接。</span></p>
			<p>2. 请参照本页面的修复建议对存在问题的业务漏洞进行修补，并及时同步修补结果</p>
			<p>3. 确认修复后会关闭该页面访问权限，安全团队复测确认后工单结束。</p>
		</div>
		</div>
		<input type="hidden" id="J_Token" name="token" value="{:session('token')}" />
		<!-- 模态窗口 -->
		<div id="modal">
		    <img id="modalImage" src="" alt="放大图像">
		</div>
  </div>
</div>
</body> 
<script src="__STATIC__/jquery.min.js"></script> 
<script src="__STATIC__/js/layer/layer.js"></script> 
<script>  
if ($('img').length > 0) { 
	$('img').css('width', '100%');   
	  // 遍历所有图像
    $('img').each(function() {
    	 // 获取当前图像的 src 属性
        const relativeUrl = $(this).attr('src'); 
    	console.log(relativeUrl);
        // 创建新的 URL 对象以获取绝对地址
        const absoluteUrl = new URL(relativeUrl, window.location.origin).href;  
    	console.log(absoluteUrl);
    	$(this).attr('src',absoluteUrl); 
    });  
 // 图片点击事件，打开模态窗口
    $('img').off('click').on('click', function() { 
        const imgSrc = $(this).attr('src');
        $('#modalImage').attr('src', imgSrc); // 设置模态图像源
        $('#modal').fadeIn(); // 显示模态窗口
    });
} 
// 点击模态背景或关闭按钮关闭模态窗口
$('#modal').on('click', function(e) {
    if (e.target !== this) return; // 确保点击的是背景
    $(this).fadeOut(); // 隐藏模态窗口
});

// 关闭按钮点击事件
$('.close-btn').on('click', function() {
    $('#modal').fadeOut(); // 隐藏模态窗口
});

// 双击模态图像关闭模态窗口
$('#modalImage').on('click', function() {
    $('#modal').fadeOut(); // 隐藏模态窗口
});
$('#J_doc').on('click', function(){  
    var content = $("#J_info").html(); 
    // 从 #J_info 中移除 #J_repay 和 #J_doc
 // 创建一个 jQuery 对象，用于操作 HTML 内容
    var tempDiv = $('<div>').html(content); 
    // 从 tempDiv 中移除 #J_repay 元素
    tempDiv.find('#J_repay').remove();
    // 从 tempDiv 中移除 #J_repay 元素
    tempDiv.find('#J_doc').remove(); 
    // 更新 #J_info 的内容
    content =tempDiv.html();
	console.log(content);
    // 创建 Blob 对象
    var blob = new Blob([content], { type: 'application/msword' });
    var url = URL.createObjectURL(blob);

    // 创建下载链接并点击
    var a = document.createElement('a');
    a.href = url;
    a.download = '{$model.title}'+'.doc'; // 文件名
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a); // 移除链接元素 
    // 释放 Blob URL
    URL.revokeObjectURL(url); 

});
$('#J_repay').on('click', function(){
	layer.open({
		title: '请简单描述你的修复方式',   
		content: `
             <div>
                 <textarea class="custom-prompt-input" rows="5" style="width:350px;">{$model.repair_method}</textarea>
                 <div style="margin-top: 10px; color: #888;">确认修复后将关闭该页面访问权限</div> 
             </div>
         `,
		area: ['400px', '300px'], // 输入框的宽高 
        btn: ['确定', '取消'], // 确定和取消按钮
		yes: function(index, layero) {
	        // 获取输入框的内容
	        var inputValue = layero.find('.custom-prompt-input').val(); 
	        var token = $('#J_Token').val();
	        // 对获取到的值进行处理
	        if (inputValue.trim() === '') {
	            layer.alert('输入内容不能为空！'); // 提示信息
	        } else {
	            //layer.msg('你输入的内容是：' + inputValue); // 显示用户输入的信息
			//这里做保存 
	            $.ajax({
	                url: "{:U('check/saveRepay')}", //url
	                type: 'POST', // 请求类型为 POST
	                data: { 
	                	repair_method: inputValue,   
		            	session_id: '{$id}',
		            	token:token,}, // 数据需要转换为 JSON 字符串
		             dataType: 'json',   // 设置内容类型
	                success: function(result) {
	                	if(result.code == 200){
	                		layer.msg(result.msg,{icon:1,time:2000,
					    		end:function(){
					    			location.reload();
				    			}
						    });  
					    }else{
					    	layer.msg(result.msg,{icon:2,time:2000});
					    }  
	                
	                },
	                error: function(xhr, status, error) {
	                    console.error('请求失败:', status, error);
	                    $('#result').html('<p>数据发送失败，请稍后再试。</p>');
	                }
	            });
	             
	            layer.close(index); // 关闭弹出窗
	        }
	    },
	    btn2: function(index, layero) { 
	        // 点击取消按钮的回调
	        layer.msg('已取消');
	    }
	});
}); 
</script>
</html>